<script setup>
// 返回
const onClickLeft = () => history.back();
</script>

<template>
  <div>
    <van-nav-bar
      :fixed="true"
      :placeholder="true"
      title="我的收藏"
      left-arrow
      @click-left="onClickLeft"
    />
    <div class="xqdzhiarr">
      <van-grid :column-num="1">
        <van-grid-item to="/zxxq">
          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>

          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>

          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>

          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
            
          </div>


          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>

          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>

          <div class="zixiaoq">
            <div class="tpkuang">
              <img src="../../assets/logo.png" alt="" />
            </div>
            <div class="shoucxx">
              <span class="scbiaoti">义务教育改革 提了哪些新要求？</span>
              <div class="rq-liull">
                <span>2019.09.09</span>
                <span> <van-icon name="eye-o" /> 1000</span>
              </div>
            </div>
          </div>
        </van-grid-item>
      </van-grid>
    </div>
  </div>
</template>



<style scoped>
.xqdzhiarr {
  background-color: #f5f5f5;
}

.zixiaoq {
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
  padding: 20px 10px;
  background-color: #fff;
  margin-top: 10px;
  display: flex;
}

.shoucxx {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.tpkuang {
  width: 120px;
  height: 90px;
  /* background-color: aqua; */
  margin-right: 10px;
}

.tpkuang img {
  width: 100%;
  height: 100%;
}

.scbiaoti {
  font-weight: 400;
  font-style: normal;
  text-align: left;
  font-size: 13px;
  color: #333333;
}

.rq-liull {
  font-weight: 400;
  font-style: normal;
  font-size: 12px;
  color: #999999;
  text-align: left;
  line-height: 24px;
}

.rq-liull span:nth-child(1) {
  margin-right: 50px;
}

.xqdzhiarr :nth-child(1) {
  margin-top: 0;
}
</style>
